
<template>
    <div>
    <el-row type="flex" class="row-bg" justify="center">
      <el-col :span="4">
        <div class="grid-content bg-purple">
          <el-row class="tac">
            <el-col :span="12" style="margin-left: 30%;">
              <h2 style="text-align: center;" to="/person-profile">个人中心</h2>
              <el-menu default-active="1" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" style="height: 1000px;">
    
                <router-link to="/personal">
                  <el-menu-item index="1">
                    <i class="el-icon-location"></i>
                    <span>个人资料</span>
                  </el-menu-item>
                </router-link>
    
    
                <router-link  to="/favorites">
                  <el-menu-item index="2">
                    <i class="el-icon-menu"></i>
                    <span>我的收藏</span>
                  </el-menu-item>
                </router-link>
    
                <router-link to="/concerns">
                  <el-menu-item index="3">
                    <i class="el-icon-document"></i>
                    <span>我的关注</span>
                  </el-menu-item>
                </router-link>
    
              </el-menu>
            </el-col>
          </el-row>
        </div>
      </el-col>
      <!-- <el-col :span="0"><div class="grid-content bg-purple-light"></div></el-col> -->
      <el-col :span="10">
        <div class="grid-content bg-purple"></div>
        <router-view></router-view>
      </el-col>
    </el-row>
    </div>
    </template>
<script>

export default {
  name:'psCenter',
  
}

</script>
<style scoped>
*{
  list-style: none;
  text-decoration: none;
}
.el-header {
    background-color: #B3C0D1;
    color: #333;
    text-align: center;
    line-height: 90px;
    font-size: 30px;
    font-family: "楷体";
    margin-top: 20px;
}



.el-aside {
    background-color: #D3DCE6;
    color: #333;
    text-align: center;
    line-height: 200px;
}

.el-main {
    /* background-color: #E9EEF3; */
    color: #333;
    text-align: center;

    height: 1000px;
}

body>.el-container {
    margin-bottom: 40px;
}

.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
    line-height: 260px;
}

.el-container:nth-child(7) .el-aside {
    line-height: 320px;
}
</style>